﻿<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0">
    <title>jBox弹窗提示框</title>

    <link rel="stylesheet" href="http://hoppinzq.com/zui/static/iframe/jbox/dist/jBox.all.css">
    <link rel="stylesheet" href="http://hoppinzq.com/zui/static/iframe/jbox/css/Demo.css">
</head>
<body>


<main class="container">

    <h2>提示框</h2>

    <div class="targets-wrapper">
        <div id="Tooltip-1" class="target">移到这里</div>
        <div id="Tooltip-2" class="target">移到这里</div>
        <div id="Tooltip-3" class="target">移到这里</div>
        <div id="Tooltip-4" class="target">移到这里</div>
        <div id="Tooltip-5" class="target">移到这里</div>
        <div id="Tooltip-6" class="target">移到这里</div>
        <div id="Tooltip-7" class="target-click">点我</div>
        <div id="Tooltip-8" class="target-click">点我</div>
    </div>

    <h2>弹出框</h2>

    <div class="targets-wrapper">
        <div id="Modal-1" class="target-click">点我</div>
        <div id="Modal-2" class="target-click">点我</div>
        <div id="Modal-3" class="target-click">点我</div>
        <div class="target-click" data-confirm
             onClick="new jBox('Notice', {content: '我是通知！', color: 'green', attributes: {y: 'bottom'}})">点我
        </div>
    </div>

    <h2>提示</h2>

    <div class="targets-wrapper">
        <div id="Notice-1" class="target-notice">点我</div>
        <div id="Notice-2" class="target-notice">点我</div>
        <div id="Notice-3" class="target-notice">点我</div>
        <div id="Notice-4" class="target-notice">点我</div>
        <div id="Notice-5" class="target-notice">点我</div>
        <div id="Notice-6" class="target-notice">点我</div>
        <div id="Notice-7" class="target-notice">点我</div>
        <div id="Notice-8" class="target-notice">点我</div>
    </div>

</main>

<script src="http://hoppinzq.com/static/js/vendor/jquery-3.5.1.min.js" type="text/javascript"></script>
<script src="http://hoppinzq.com/zui/static/iframe/jbox/dist/jBox.all.js"></script>
<script src="http://hoppinzq.com/zui/static/iframe/jbox/js/Demo.js"></script>

</body>
</html>